<!DOCTYPE html>
<html lang="zh-CN">
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <title>优惠列表</title>
    <!-- Bootstrap -->
    <link rel="stylesheet" href="//cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap.min.css">
    <link href="__PUBLIC__/Css/activity.css" rel="stylesheet">

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="//cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="//cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>
<body>
	<!-- <nav class="navbar navbar-fixed-top header">
	  <div class="container" >
	  	<div class="row">
		  	<div class="col-xs-3">
		  		<a href="__MODULE__/Qlindex/qlindex">
			  	<button class="btn remove">
		                <span class='glyphicon glyphicon-remove '></span>
		        </button>
		        </a>
	        </div>
	        <div class="col-xs-6 text-center">
	        	<span class="title">优惠列表</span>
	        </div>
	        <div class="col-xs-3">
	        	<button class="btn pull-right option">
		                <span class='glyphicon glyphicon-option-vertical'></span>
		        </button>

	        </div>
        </div>
	  </div>
	</nav> -->

	<nav class="container-fluid navbar navbar-inverse " style="margin-bottom:0;">
       <div class="navbar-header navbar navbar-inverse" style="margin-bottom:0;">
         <div class="navbar-brand" >
            <a href="__MODULE__/qlindex/qlindex" style="text-decoration: none"><span class="glyphicon glyphicon-arrow-left white" style="color:#9d9d9d;"></span>
            <span style="color:#9d9d9d;">主页</span></a>
       </div></div>
  	</nav>

	
	<!-- <div class="container infor">
		<div class="row">
			
			<div class="col-xs-2">
				<img src="__PUBLIC__/Images/more_icon_none.png" class="img-responsive center-block" alt="外婆家"/>
			</div>
			<div class="col-xs-3 city">福州<span class="glyphicon glyphicon-menu-down"></span></div>
			<div class="col-xs-7">
				霸气值：<span class="num">1</span><button class="btn btn-default btn-xs about"><span class="glyphicon glyphicon-question-sign"></span></button>
				<button class="btn btn-default pull-right sign">已签到</button>
			</div>
		</div>
	</div> -->

	<div class="container infor" style="padding-top:1em;">
		<img src="__PUBLIC__/Images/thumb.jpg" class="img-responsive" alt="外婆家"/>
	</div>

	<div class="container choose">
		<div class=" btn-group btn-group-justified">
				<div class="btn-group">
				  <button type="button" class="btn btn-primary dropdown-toggle line" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">附近优惠<!-- <span class="glyphicon glyphicon-menu-down"></span> -->
				  </button>
				 <!--  <ul class="dropdown-menu">
				    <li><a href="#">Action</a></li>
				    <li><a href="#">Another action</a></li>
				  </ul> -->
				</div>


				<div class="btn-group">
				  <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">热门优惠<!-- <span class="glyphicon glyphicon-menu-down"></span> -->
				  </button>
				 <!--  <ul class="dropdown-menu">
				    <li><a href="#">Action</a></li>
				    <li><a href="#">Another action</a></li>
				  </ul> -->
				</div>




				<!-- <div class="btn-group">
				  <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">排序<span class="glyphicon glyphicon-menu-down"></span>
				  </button>
				  <ul class="dropdown-menu">
				    <li><a href="#">Action</a></li>
				    <li><a href="#">Another action</a></li>
				  </ul>
				</div>




				<div class="btn-group">
				  <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">筛选<span class="glyphicon glyphicon-menu-down"></span>
				  </button>
				  <ul class="dropdown-menu">
				    <li><a href="#">Action</a></li>
				    <li><a href="#">Another action</a></li>
				  </ul>
				</div> -->

		</div>
	
	</div>

	<div class="container activities" id="pre">
		<volist name="preinfor" id="vo1">
			<div >
				<div class="row">
					<div class="col-xs-12 " style="border-bottom:1px solid #EDEDED;font-size:17px;padding-top:.5em;padding-bottom:.5em;">{$vo1.shopname}<span class="pull-right">1km</span></div>
					<volist name="predetails" id="vo2">
						<if condition="$vo1['bs_id'] eq $vo2['buss'] "> 
							
							<div class="row media ad">
					            <div class="media-left col-xs-4 ">
					                    <img class="img-responsive" src="__PUBLIC__/Images/a.jpg" alt="...">
					            </div>
					            <div class="media-body ">
					                <h5 class="media-heading">{$vo2.context}</h5>
					                <div class="media-bottom">
						                <span >{$vo2.id}</span>
						                <span class="pull-right">已售17</span>
					            	</div>
					            </div>
					            <div class="media-right " style="padding-right:15px;">
					                <button class="btn bg-primary">详情</button>
					            </div> 
					    	</div>
					    </if>
					</volist> 
				
				</div>
			</div>
		</volist>
		<!-- <div >
			<div class="row">
				<div class="col-xs-12 " style="border-bottom:1px solid #EDEDED;font-size:17px;padding-top:.5em;padding-bottom:.5em;">假日酒店<span class="pull-right">1km</span></div> -->
				<!-- <div class="col-xs-4 pull-right" style="border-bottom:1px solid #EDEDED;font-size:17px;padding-top:.5em;padding-bottom:.5em;">1km</div> -->
			<!-- </div>
		    <div class="row media ad">
		       
		            <div class="media-left col-xs-4 ">
		                    <img class="img-responsive" src="__PUBLIC__/Images/a.jpg" alt="...">
		            </div>
		            <div class="media-body ">
		                <h5 class="media-heading">【外面霸王餐】50元外面券免费抢！</h5>
		                <div class="media-bottom">
			                <span >未知</span>
			                <span class="pull-right">已售17</span>
		            	</div>
		            </div>
		            <div class="media-right " style="padding-right:15px;">
		                <button class="btn bg-primary">详情</button>
		            </div>
		       
		    </div>
	    

		    <div class="row media ad" >
	       
	            <div class="media-left col-xs-4 ">
	                    <img class="img-responsive" src="__PUBLIC__/Images/a.jpg" alt="...">
	            </div>
	            <div class="media-body ">
	                <h4 class="media-heading">【外面霸王餐】50元外面券免费抢！</h4>
	                <div class="media-bottom">
		                <span >未知</span>
		                <span class="pull-right">180人中奖</span>
	            	</div>
	            </div>
	            <div class="media-right " style="padding-right:15px;">
	                <button class="btn bg-primary">抽</button>
	            </div>
	      </div>
	       
	    </div>

	    <div >
			<div class="row">
				<div class="col-xs-12 " style="border-bottom:1px solid #EDEDED;font-size:17px;padding-top:.5em;padding-bottom:.5em;">假日酒店<span class="pull-right">1km</span></div> -->
				<!-- <div class="col-xs-4 pull-right" style="border-bottom:1px solid #EDEDED;font-size:17px;padding-top:.5em;padding-bottom:.5em;">1km</div> -->
			<!-- </div>
		    <div class="row media ad">
		       
		            <div class="media-left col-xs-4 ">
		                    <img class="img-responsive" src="__PUBLIC__/Images/a.jpg" alt="...">
		            </div>
		            <div class="media-body ">
		                <h4 class="media-heading">【外面霸王餐】50元外面券免费抢！</h4>
		                <div class="media-bottom">
			                <span >未知</span>
			                <span class="pull-right">已售17</span>
		            	</div>
		            </div>
		            <div class="media-right " style="padding-right:15px;">
		                <button class="btn bg-primary">详情</button>
		            </div>
		       
		    </div>
	    

		    <div class="row media ad" style="border-bottom:10px solid #EDEDED;">
	       
	            <div class="media-left col-xs-4 ">
	                    <img class="img-responsive" src="__PUBLIC__/Images/a.jpg" alt="...">
	            </div>
	            <div class="media-body ">
	                <h4 class="media-heading">【外面霸王餐】50元外面券免费抢！</h4>
	                <div class="media-bottom">
		                <span >未知</span>
		                <span class="pull-right">180人中奖</span>
	            	</div>
	            </div>
	            <div class="media-right " style="padding-right:15px;">
	                <button class="btn bg-primary">抽</button>
	            </div>
	      </div>
	       
	    </div>

	    <div class="row media ad">
	       
	            <div class="media-left col-xs-4 ">
	                    <img class="img-responsive" src="__PUBLIC__/Images/a.jpg" alt="...">
	            </div>
	            <div class="media-body ">
	                <h4 class="media-heading">【外面霸王餐】50元外面券免费抢！</h4>
	                <div class="media-bottom">
		                <span >未知</span>
		                <span class="pull-right">180人中奖</span>
	            	</div>
	            </div>
	            <div class="media-right " style="padding-right:15px;">
	                <button class="btn bg-primary">抽</button>
	            </div>
	       
	    </div>

	    <div class="row media ad">
	       
	            <div class="media-left col-xs-4 ">
	                    <img class="img-responsive" src="__PUBLIC__/Images/a.jpg" alt="...">
	            </div>
	            <div class="media-body ">
	                <h4 class="media-heading">【外面霸王餐】50元外面券免费抢！</h4>
	                <div class="media-bottom">
		                <span >未知</span>
		                <span class="pull-right">180人中奖</span>
	            	</div>
	            </div>
	            <div class="media-right " style="padding-right:15px;">
	                <button class="btn bg-primary">抽</button>
	            </div>
	       
	    </div> -->

    </div>

	
	<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="//cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="//cdn.bootcss.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=o4jtg1jg3TumASwaBl8DVKKTC1qbysvb"></script>
    <script>

    	//调用百度地图获取位置API
		var geolocation = new BMap.Geolocation();
		geolocation.getCurrentPosition(function(r){
			if(this.getStatus() == BMAP_STATUS_SUCCESS){
				var mk = new BMap.Marker(r.point);
				// alert('您的位置：'+r.point.lng+','+r.point.lat);
				getPrefe(r.point.lng,r.point.lat);
				// select("1",r.point.lng,r.point.lat);   //页面一进来，根据百度地图获取的位置加载附近的商家，百度地图获取位置有延时，所以页面会有几秒的延时加载  
				// showAround("1",r.point.lng,r.point.lat); //点击附近的商家
				// showHot("2",r.point.lng,r.point.lat);   //点击热门
				// search("3",r.point.lng,r.point.lat);	//点击搜索
				// showMap(r.point.lng,r.point.lat);		//地图跳转
			}
			else {
				alert('failed'+this.getStatus());
			}        
		},{enableHighAccuracy: true})


		//构造优惠列表
    	function create(parent,img,context,id,num,shopid){
    		// var $todetails=$('<a></a>');
    		// $todetails.attr("href","__CONTROLLER__/showPD/id/"+id+"shopid/"+shopid);

    		var $prefe=$('<div class="row media ad"></div>');
    		var $preimg=$('<div class="media-left col-xs-4 "></div>');
    		var $img=$('<img class="img-responsive" src="'+img+'" alt="...">');

    		var $preinfor=$('<div class="media-body "></div>');
    		var $precontext=$('<h5 class="media-heading">'+context+'</h5>');
    		var $prede=$('<div class="media-bottom"></div>');
    		var $preprice=$('<span >'+id+'<span>人已使用</span></span>');
    		var $premuch=$('<span class="pull-right"></span>');
    		var $more=$(' <div class="media-right " style="padding-right:15px;"><a href="__CONTROLLER__/showPD/id/'+id+'shopid/'+shopid+'"><button class="btn bg-primary">详情</button></a></div>');


    		$prefe.appendTo(parent);
    		$preimg.appendTo($prefe);
    		$preinfor.appendTo($prefe);
    		// $todetails.appendTo($prefe);
    		$more.appendTo($prefe);

    		$img.appendTo($preimg);
    		
    		$precontext.appendTo($preinfor);
    		$prede.appendTo($preinfor);
    		$preprice.appendTo($prede);
			$premuch.appendTo($prede);

    		
    	}


   		//ajax请求后台显示商家
   		function getPrefe($lat,$lon){
				var $jsonobj={"lat":$lat,"lon":$lon};
				$.ajax({                                    
			        type:"post",
			        url:"__CONTROLLER__/getPrefe/",
			        dataType:"json",
			        data:$jsonobj,
			        success:function(data){
			        	
			        	$(data).each(function(i,val){
			        		$pre=$('<div ><div class="row"><div class="col-xs-12 " style="border-bottom:1px solid #EDEDED;font-size:17px;padding-top:.5em;padding-bottom:.5em;">'+val["shopname"]+'<span class="pull-right">'+val["dis"]+'<span>Km</span></span></div></div></div>');
			        		$pre.appendTo($("#pre"));
			        		$(val["data"]).each(function(i,value){
			        			parent=$pre;
			        			img=value.image;
			        			context=value.context;
			        			id=value.id;
			        			num="17人已使用";
			        			create(parent,img,context,id,num,val['bs_id']);
			        		});
			        	});
			        },
			        error:function(XMLResponse,err){
			            console.log(err);
			        },
				});
   		}

  //  		//点击附近的商家
  //  		function showAround($type,$lat,$lon){
  //  			$("#around").on("click",function(){
  //  				$("#dataInput").val("");
		// 		$("#shops").empty();
		// 		select($type,$lat,$lon);
		// 	});
  //  		}

  //  		//点击热门
  //  		function showHot($type,$lat,$lon){
  //  			$("#hot").on("click",function(){
  //  				$("#dataInput").val("");
		// 		$("#shops").empty();
		// 		select($type,$lat,$lon);
		// 	});
  //  		}

  //  		//点击搜索
  //   	function search($type,$lat,$lon){
		// 	$("#search").on("click",function(){
		// 		$("#shops").empty();
		// 		select($type,$lat,$lon);
		// 	});
  //   	}


		
		// //点击地图
  //  		function showMap($lat,$lon){
  //  			$("#map").on("click",function(){
  //  				window.location.href="__CONTROLLER__/showMap/lat/"+$lat+"/lon/"+$lon; 
  //  			});
  //  		}

		// $('#dataInput').bind('keypress',function(event){
  //           if(event.keyCode == "13")    
  //           {
  //              $infor=$("#dataInput").val();
		// 		alert($infor)
  //           }
  //       });
    </script>
</body>
</html>